<template>
  <div id="container">
    <div class="title">{{ title }}</div>
    <div class="content">个人中心中间区域</div>
    <tab-bar :tab-index="tabIndex"/>
  </div>
</template>
<script>
import TabBar from "../../components/TabBar";
export default {
  name: "User",
  components: {
    TabBar,
  },
  data: function () {
    return {
      title: "个人中心",
      tabIndex:4,
    };
  },
};
</script>
<style scoped>
#container {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.title {
  width: 100%;
  height: 30em;
  background-color: blueviolet;
}
.content {
  display: flex;
  flex-direction: column;
  flex: 1;
}
</style>

